<template>
  <el-dialog
    top="30px"
    width="600px"
    append-to-body
    title="准入信息"
    :visible.sync="visible"
    :close-on-click-modal="false"
    :before-close="beforeClose"
  >
    <div class="d-flex">
      <div class="label">机构名称：</div>
      <div class="flex-1">{{ accessInfo.agency_name }}</div>
    </div>
    <div class="d-flex" v-if="!is28Business">
      <div class="label">贷款利率：</div>
      <div class="flex-1">{{ accessInfo.load_rate }} %</div>
    </div>
    <div class="d-flex" v-if="!is28Business">
      <div class="label">风险分担比例：</div>
      <div class="flex-1">{{ accessInfo.risk_rate }} %</div>
    </div>
    <div class="d-flex" v-if="!is28Business">
      <div class="label">
        <div>业务规模占比：</div>
        <div class="text-center">（10-300万)</div>
      </div>
      <div class="flex-1">{{ accessInfo.bus_scale_rate }} %</div>
    </div>
    <div class="d-flex" v-if="!is28Business">
      <div class="label">代偿比例：</div>
      <div class="flex-1">{{ accessInfo.comps_rate }} %</div>
    </div>

    <div class="d-flex" v-if="!is28Business">
      <div class="label">保证合同号：</div>
      <div class="flex-1">{{ accessInfo.gua_contract }}</div>
    </div>
    <div class="d-flex" v-if="!is28Business">
      <div class="label">合作金额：</div>
      <div class="flex-1">{{ accessInfo.coo_amount }} 万元</div>
    </div>
    <div class="d-flex" v-if="is28Business">
      <div class="label">授信金额：</div>
      <div class="flex-1">{{ accessInfo.credit_amount }}</div>
    </div>
    <div class="d-flex">
      <div class="label">合作开始时间：</div>
      <div class="flex-1">
        {{ $utils.dateFormat(accessInfo.cooperate_date_start, 'yyyy-MM-dd') }}
      </div>
    </div>
    <div class="d-flex">
      <div class="label">合作结束时间：</div>
      <div class="flex-1">{{ $utils.dateFormat(accessInfo.cooperate_date_end, 'yyyy-MM-dd') }}</div>
    </div>
    <div class="d-flex">
      <div class="label">资本金：</div>
      <div class="flex-1">{{ accessInfo.margin_amount }} 万元</div>
    </div>
    <div class="d-flex">
      <div class="label">附件：</div>
      <div class="flex-1">
        <div v-for="(p, index) of attachment" @click="previewImg(index)" :key="index">
          <img :src="p" class="attachment-image" />
        </div>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import { arrayFromString } from '@vimi/utils-tool'

export default {
  props: {
    type: { type: String, default: '1' },
    visible: Boolean,
    accessInfo: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {}
  },
  computed: {
    attachment() {
      return arrayFromString(this.accessInfo.attachment)
    },
    images() {
      return this.attachment.map(item => {
        return { src: item }
      })
    },
    is28Business() {
      return +this.type === 1
    },
  },
  created() {},
  methods: {
    beforeClose() {
      this.$emit('update:visible', false)
    },
    previewImg(index) {
      this.$utils.viewer({
        images: this.images,
        index,
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.label {
  text-align: right;
  width: 120px;
  margin-right: 10px;
  color: $gray-700;
  font-size: 1.2rem;
}
.d-flex {
  line-height: 2.1rem;
}
.attachment-image {
  width: 120px;
  height: 120px;
  margin: 10px 10px 0px 0px;
}
</style>
